<template>
    <div v-if="indexFlog>4 && indexFlog<=13">
    <van-tabs v-model:active="active" color="#27ba9b" v-if="Goods[indexFlog][0]">
      <van-tab v-for="Items in Goods[indexFlog][0].children" :title="Items.name" :key="Items.id">
        <div class="iot_HotBox">
            <GoodsCell 
            v-for="item in Items.goods"
            :key="item.id" 
            :src="item.picture" 
            :id="item.id"
            :Name="item.name"
            :price="item.price"></GoodsCell>
        </div>
      </van-tab>
    </van-tabs>
    <a  href="" class="iot_tip" @click.prevent="">点击加载全部</a>
</div>
    </template>
    
    <script>
    import { inject, ref } from 'vue';
    import GoodsCell from './GoodsCell.vue';
    export default {
        components:{
            GoodsCell
        },
        props:['indexFlog'],
      setup(props) {
        const active = ref(0)
        let Goods = inject('Goods') 
        return { active,Goods,props};
      },
    };
    </script>
    
    <style>
    .iot_potion{
        width: 100%;
        background: #aaa;
    }
    .iot_HotBox{
        display: flex;
        flex-wrap: wrap;
    }
    .iot_tip{
        display: block;
        color: #27ba9b;
        margin: 15px 0;
        background-color: #fff;
        font-size: 20px;
        font-family:'Times New Roman', Times, serif;
    }
    </style>